import React, {PureComponent} from "react";
import {Divider, notification, Popconfirm, Table} from "antd";
import {connect} from "react-redux";
import {tableProps} from "../../lib/ui";
import {del, getAll, getUsers, showCreate, showModify, showUsers, unused, using} from "./actions";
import {getPrincipal} from "../../lib/identity";

const LAST_FILTER = "organization";

class List extends PureComponent {

    componentWillMount() {
        const {dispatch} = this.props;
        const principal = getPrincipal();
        dispatch(getAll(principal.id));
    };

    handleAddSubOrg = parentId => {
        const {dispatch} = this.props;
        dispatch(showCreate(parentId));
    };

    handleUpdate = record => {
        const {dispatch} = this.props;
        dispatch(showModify(record));
    };
    handleShowUsers = id => {
        const {dispatch} = this.props;
        dispatch(showUsers(id));
        dispatch(getUsers(id));
    };

    handleUnused = id => {
        const {dispatch} = this.props;
        dispatch(unused(id)).then(action => {
            if (action.error !== true) {
                dispatch(getAll(getPrincipal().id));
                notification.success({
                    message: '禁用成功'
                });
            }
        });
    };

    handleUsing = id => {
        const {dispatch} = this.props;
        dispatch(using(id)).then(action => {
            if (action.error !== true) {
                dispatch(getAll(getPrincipal().id));
                notification.success({
                    message: '启用成功'
                });
            }
        });
    };

    handleDelete = id => {
        const {dispatch} = this.props;
        dispatch(del(id)).then(action => {
            if (action.error !== true) {
                dispatch(getAll(getPrincipal().id));
                notification.success({
                    message: '删除成功'
                });
            }
        });
    };

    render() {
        const columns = [
            {
                title: "抬头",
                dataIndex: "name",
                width: "300px",
            }, {
                title: "编号",
                dataIndex: "prefix",
                width: "100px"
            }, {
                title: "公司全称",
                dataIndex: "fullName"
            }, {
                title: '功能',
                dataIndex: '',
                key: 'x',
                render: (text, record) => <span>
                    <a onClick={() => this.handleUpdate(record)}>编辑</a>
                    <Divider type="vertical"/>
                    <a onClick={() => this.handleAddSubOrg(record.id)}>添加子机构</a>
                    <Divider type="vertical"/>
                    <a onClick={() => this.handleShowUsers(record.id)}>用户</a>
                    <Divider type="vertical"/>
                    {record.status === 'USING' ? <a onClick={() => this.handleUnused(record.id)}>禁用</a> :
                        <a onClick={() => this.handleUsing(record.id)}>启用</a>}
                    <Divider type="vertical"/>
                    <Popconfirm title="确定删除此组织机构?" okText="是" cancelText="否"
                                onConfirm={() => this.handleDelete(record.id)}>
                        <a>删除</a>
                    </Popconfirm>
                </span>
            }
        ];
        const {
            dataSource,
            loading
        } = this.props;

        return (
            <Table
                {...tableProps}
                columns={columns}
                dataSource={dataSource}
                defaultExpandAllRows={true}
                loading={loading}
            />
        );
    }
}

const mapStateToProps = state => {
    return {
        ...state.organization.list
    };
};

export default connect(mapStateToProps)(List);
